<template>
  <div class="alumniOrganization">
    <div class="header" style="background: white">
      <u-tabs
        :list="list1"
        lineWidth="35"
        activeStyle="#8853b0"
        lineColor="#8853b0"
        @click="tabsClick"
      ></u-tabs>
    </div>
    <div class="content">
      <div class="item" v-for="(item, index) in Data" :key="index">
        <div class="className margin_top">{{ item.name }}</div>
        <div class="personalInformation">
          <div class="margin_top" style="display: flex; align-items: center">
            <div style="display: flex; align-items: ">
              <span class="iconfont icon-geren"></span>
              <div style="margin-left: 5px">联系人：</div>
            </div>
            <div>{{ item.linkman }}</div>
          </div>
          <div class="margin_top" style="display: flex; align-items: ">
            <div style="display: flex; align-items: center">
              <span class="iconfont icon-bodadianhua"></span>
              <div style="margin-left: 5px">电&nbsp;&nbsp;&nbsp;话：</div>
            </div>
            <div>{{ item.telephone }}</div>
          </div>
          <div class="margin_top" style="display: flex; align-items: ">
            <div style="display: flex; align-items: center">
              <span class="iconfont icon-xinfeng"></span>
              <div style="margin-left: 5px">邮&nbsp;&nbsp;&nbsp;箱：</div>
            </div>
            <div>{{ item.email }}</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import "@/static/iconfont/iconfont.css";
export default {
  data() {
    return {
      Data: [],
      list1: [
        {
          name: "广西",
        },
        {
          name: "北京",
        },
        {
          name: "上海",
        },
        {
          name: "广东",
        },
        {
          name: "浙江",
        },
        {
          name: "湖南",
        },
        {
          name: "河南",
        },
        {
          name: "安徽",
        },
      ],
    };
  },
  onLoad() {
    this.$apis.orgList().then((res) => {
      console.log(res, "组织数据");
      if (res.success) {
        this.Data = res.result;
      }
    });
  },
  methods: {
    tabsClick(index) {
      console.log(index);
    },
  },
};
</script>
<style lang="scss" scoped>
.alumniOrganization {
  .header {
  }

  .content {
    height: 92vh;
    overflow: auto;

    .item {
      padding: 15px 25px;
      background-color: #fff;
      margin: 15px 0;

      .className {
        // margin-left: 10px;
      }

      .personalInformation {
        margin-top: 15px;
        font-size: 14px;
      }
    }
  }

  .header /deep/ .u-tabs__wrapper__nav__item {
    padding: 0 32px !important;
  }

  .header /deep/ .u-tabs__wrapper__nav__item__text {
    font-size: 17px;
  }

  .margin_top {
    margin-top: 8px;
  }
}
</style>
